<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>购物车</title>
    <link rel="icon" href="https://www.womai.com/favicon.ico" />
    <link rel="stylesheet" href="../css/cart.css" />
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.11.3/jquery.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.js"></script>
  </head>
  <body>
    <!-- 表头导航 --> 
    <div class="header">
      <ul>
        <li style="border-right: solid 1px #ddac78; padding-right: 15px">
          Hi，欢迎来我买网,<a href="../html/login.html">请登录</a>
        </li>
        <li style="border-left: solid 1px #78acdd; padding-left: 15px">
          <a href="../html/reg.html"><span>免费注册</span></a>
          <a href=""><span>我的账户</span></a>
        </li>
      </ul>
    </div>
    <!-- 支付流程 --> 
    <div class="liucheng">
      <a href="../html/index.html"
        ><img
          src="/img/6.png"
          alt=""
          class="img1"
      /></a>
      <img src="" alt="" class="img2" />
    </div>

    <!-- 购物车没有商品的时候显示 -->
    <div class="empty yincang">
      <div class="cart_empty">
        <p class="trip_p">您的购物车中没有商品，赶快行动吧！</p>
        <p class="line_p">
          去
          <a
            href="../html/index.html"
            class="indexa"
            style="color: #e9001c; text-decoration: none"
            >首页</a
          >
          挑选喜爱的商品，或
          <a
            href="../html/login.html"
            class="clogina"
            style="color: #8cb91e; text-decoration: none"
            >登录</a
          >
          访问收藏的商品。
        </p>
      </div>
    </div>

    <!-- 购物车有商品的时候显示 -->
    <div class="have">
      <!-- 我的购物车 -->
      <section class="myCart">
        <p class="myCart_p">我的购物车</p>
        <a href="../html/index.html" class="myCarta">继续购物></a>
      </section>
      <!-- 购物车内容 -->
      <table class="myCart_text">
      </table>
      <!-- 复选框全选和结算页面 -->
      <div class="jiesuan">
        <div class="check">
          <input type="checkbox" class="allCheck" />
          全选
        </div>
        <div class="jiesuan_right">
          <p class="jiesuan_p" style="margin-top: 50px">
            已选<span class="jiesuan_span" style="color: crimson">0</span>件
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            &nbsp;&nbsp;&nbsp;&nbsp;应付金额：<span
              class="jiesuan_num"
              style="color: crimson; font-size: 14px; margin-left: 50px"
              >100</span
            >
          </p>
          <div
            class="jiesuan_bottom"
            style="width: 306px; height: 35px; margin-top: 50px"
          >
            <div class="left"></div>
            <div
              class="right"
              style="
                float: right;
                width: 169px;
                height: 35px;
                background: #ea6515;
                color: white;
                text-align: center;
                line-height: 35px;
                cursor: pointer;
              "
            >
              去结算
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- 底部 -->
    <div class="bottom">
      <img src="/img/112.png" alt="" />
    </div>

    <!-- js -->
    <script src="../js/cart.js"></script>
  </body>
</html>
